<template>
  <div class="page-container">
    <div class="common-content-wrap">
      <TrTable
        ref="trTable"
        isNeedSelection
        :btnList="btnList"
        :total="totalNum"
        v-model="searchParams"
        :searchShowList="searchShowList"
        :tableColumn="tableColumn"
        requestName="searchHandle"
        :tableData="tableData"
        @authAllocation="operateHandle($event, 'authAllocation')"
        @delete="operateHandle($event, 'delete')"
        @rowDelete="operateHandle($event, 'rowDelete')"
      />
      <TrPower
        v-model="isShowRolePopup"
        :checkedList.sync="checkedList"
        :leftRequstObj="leftRequstObj"
        :rightRequstObj="rightRequstObj"
        :rightDefaultParams="rightDefaultParams"
        :tableColumn="tableColumns"
        @confrim="confrimHandle"
        @single-select="singleSelectHandle"
      />
    </div>
  </div>
</template>

<script>
import TrTable from "@/components/Tr-table/Tr-table.vue";
import TrPower from "@/components/Tr-power/Tr-power.vue";
import { getList, remove, save } from "@/api/baseCode/workStationAuth";
export default {
  components: {
    TrTable,
    TrPower,
  },
  name: "WorkStationAuthBox",
  data: () => ({
    checkedList: [],
    tableColumns: [
      {
        type: "text",
        label: "工站编码",
        value: "stationCode",
      },
      {
        type: "text",
        label: "工站名称",
        value: "stationName",
      },
      {
        type: "text",
        label: "工站描述",
        value: "remark",
      },
    ],
    leftRequstObj: {
      url: "/api/trio-system/user/mes/page",
      method: "post",
      searchKey: "account",
      rlLabel: "username",
      rlValue: "id",
      resultKey: "data,data,records",
    },
    rightRequstObj: {
      url: "/api/mes-production-service/work-station/page",
      method: "post",
      searchKey: "stationName",
      rlLabel: "stationName",
      rlValue: "id",
      resultKey: "data,data,records",
      isNeedSelection: true,
      urlConfig: {
        isShowLoading: true,
      },
    },
    rightDefaultParams: {
      isEnabledList: [1],
    },
    tableColumn: [
      {
        type: "text",
        label: "用户",
        value: "mesUserAccount",
      },
      {
        type: "text",
        label: "姓名",
        value: "mesUserName",
      },
      {
        type: "text",
        label: "工站编码",
        value: "stationCode",
      },
      {
        type: "text",
        label: "工站名称",
        value: "stationName",
      },
      {
        type: "text",
        label: "工站描述",
        value: "remark",
      },
      {
        type: "text",
        label: "创建人员",
        value: "createUserName",
      },
      {
        type: "text",
        label: "创建时间",
        value: "createTime",
      },
      {
        type: "option",
        label: "操作",
        fixed: "right",
        width: 80,
        showBtnList: [
          {
            label: "删除",
            option: "rowDelete",
          },
        ],
      },
    ],
    searchShowList: [
      {
        id: "stationCode",
        type: "input",
        width: 33.33,
        label: "工站编码",
        value: "",
      },
      {
        id: "stationName",
        type: "input",
        width: 33.33,
        label: "工站名称",
        value: "",
      },
      {
        id: "userId",
        type: "loadselect",
        width: 33.33,
        label: "用户",
        value: "",
        list: [],
        requestObj: {
          url: "/api/trio-system/user/mes/page",
          method: "post",
          searchKey: "account",
          rlLabel: "username",
          rlValue: "id",
          resultKey: "data,data,records",
        },
      },
    ],
    btnList: [
      {
        label: "权限分配",
        option: "authAllocation",
        color: "blue",
      },
      {
        label: "删除",
        option: "delete",
        color: "white",
        isRelaTable: true,
      },
    ],
    tableData: [],
    searchParams: {
      current: 1,
      size: 10,
    },
    totalNum: 0,
    isShowRolePopup: false,
  }),
  computed: {
    ids() {
      let ids = [];
      this.$refs.trTable.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids;
    },
  },
  mounted() {
    // this.getListHandle();
  },
  methods: {
    singleSelectHandle(val) {
      getList({ size: 1000, current: 1, userId: val.rlValue }).then((res) => {
        console.log(res, "ppppppppp");
        if (res.data.code == 200) {
          this.checkedList = res.data.data.records.map(
            (item) => item.stationId
          );
        }
      });
    },
    confrimHandle({ perValue, keysList }) {
      let params = {
        stationIdList: keysList,
        userAccount: perValue.account,
        userDeptName: perValue.deptName,
        userId: perValue.id,
        userName: perValue.realName,
      };
      this.saveHandle(params);
    },
    operateHandle(val, type) {
      const actions = {
        authAllocation: () => (this.isShowRolePopup = true),
        delete: () => {
          console.log("多选删除", this.ids);
          this.removeHandle(this.ids);
        },
        rowDelete: () => {
          console.log("行删除", [val.id]);
          this.removeHandle([val.id]);
        },
      };

      const action = actions[type];
      if (action) action();
    },
    searchHandle() {
      this.getListHandle();
    },
    async getListHandle() {
      const { data } = await getList(this.searchParams);
      if (data.code != 200) return;
      this.$validateData(data.data);
      this.tableData = data.data.records;
      this.totalNum = Number(data.data.total);
    },
    async removeHandle(ids) {
      await this.$textShow({
        title: "删除",
        content: [this.$t("tip.delete")],
      });
      const { data } = await remove({ ids });
      if (data.code !== 200) return;
      this.$refs.trTable.clearSelect();
      this.$message.success(this.$t("msg.success"));
      this.searchParams.current = 1;
      this.getListHandle();
    },
    async saveHandle(params) {
      const { data } = await save(params);
      console.log(data);
      this.isShowRolePopup = false;
      if (data.code != 200) return;

      this.$message.success(this.$t("msg.success"));
      this.searchParams.current = 1;
      this.checkedList = [];
      this.getListHandle();
    },
  },
};
</script>
